@import '~antd/lib/style/themes/default.less';

.leaves {
  position: absolute;
  top: 0;
  left: 0;
  width: 182px;
  height: 90px;
  background: url(../assets/images/guidepage/leaves.png);
  z-index: 1000;
}

.header {
  width: 100%;
  height: 100px;
  background: #f5f5f5;
  box-shadow: 0 5px 5px -5px #5e5e5e;
  font-size: 15px;

  .headerWarpper,
  .landspaceHeaderWarpper {
    height: 65px;
    background: #e1efe4;
    background-repeat: no-repeat;
    box-shadow: 0 5px 5px -5px #5e5e5e;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: space-between;

    .logoWarpper {
      margin: 0 20px;
    }

    .menu {
      margin: 0 10px;
      color: #417422;
      display: flex;
      display: -webkit-flex;
      align-items: center;

      .menuItem {
        height: 30px;
        line-height: 30px;
        font-weight: bold;
        margin: 0 10px;
        border-radius: 20px;
        background-color: rgba(255, 255, 255, 0.7);

        span {
          padding: 15px;

          &:hover {
            cursor: pointer;
          }
        }
      }
    }
  }
  .headerWarpper {
    background-image: url(../assets/images/guidepage/banner_municipal.png);
  }
  .landspaceHeaderWarpper {
    background-image: url(../assets/images/guidepage/banner_landspace.png);
  }

  @sidebarHeight: 30px;
  .sidebar {
    margin-top: 4px;
    display: flex;
    display: -webkit-flex;
    justify-content: flex-end;
    height: @sidebarHeight;
    margin-right: 20px;

    .sidebarItem {
      color: #555;
      font-weight: bold;
      padding: 0 20px;
      height: @sidebarHeight;
      line-height: @sidebarHeight;

      &:hover {
        cursor: pointer;
        background: #fff;
        color: #89be66;
        transition: all 0.5s;
      }
    }

    .active {
      font-weight: bold;
      padding: 0 20px;
      cursor: pointer;
      background: #89be66;
      color: #fff;
      height: @sidebarHeight;
      line-height: @sidebarHeight;
      transition: all 0.5s;
    }
  }
}
